<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>listitem</title>
<link rel="stylesheet" href="../../goog/css/common.css">
<link rel="stylesheet" href="../../goog/css/menuseparator.css">
<link rel="stylesheet" href="../../goog/css/flatmenubutton.css">
<link rel="stylesheet" href="../../goog/css/checkbox.css">
<link rel="stylesheet" href="../../goog/css/button.css">
<link rel="stylesheet" href="../../goog/css/custombutton.css">
<link rel="stylesheet" type="text/css" href="../../goog/css/css3button.css">
<script src="../../goog/base.js"></script>
<script>
goog.require('goog.ui.Component');
</script>
<script src="component.js"></script>
<script src="listitemrenderer.js"></script>
<script src="listitem.js"></script>
<script>
goog.require('goog.dom');
goog.require('goog.ui.Button');
goog.require('goog.ui.ButtonRenderer');
goog.require('goog.ui.ButtonSide');
goog.require('goog.ui.CustomButton');
goog.require('goog.ui.Css3ButtonRenderer');
</script>
<style>
body {
	font: 10pt/1.2em Arial, sans-serif; 
}
#buttons {
	margin-top: 50px;
}
.fiesc-li {
	padding: 10px 5px;
}

.fiesc-li-odd {
	background-color: #f5f5f5;
}

</style>
</head>
<body>
<div id="item"></div>
<div id="buttons"></div>
<script>
console.log(goog.events.getTotalListenerCount());

var listitem = new fiesc.ui.ListItem();
listitem.setDescription('Tiago');
listitem.setSelectable(false);
listitem.setSelected(true);
var tooltip = new goog.ui.Tooltip(null);
tooltip.setHtml('<b>Tiago Wust Freres</b>');
listitem.setTooltip(tooltip);
listitem.render(goog.dom.getElement('item'));
var listitem2 = new fiesc.ui.ListItem();
listitem2.setDescription('Frederico');
listitem2.setSelectable(true);
listitem2.setSelected(false);
var tooltip = new goog.ui.Tooltip(null);
tooltip.setHtml('<b>Frederico Machado</b>');
listitem2.setTooltip(tooltip);
listitem2.render(goog.dom.getElement('item'));
listitem2.getElement().className = 'fiesc-li fiesc-li-odd';

console.log(goog.events.getTotalListenerCount());

var bt1 = new goog.ui.CustomButton('Change selectable',
		goog.ui.Css3ButtonRenderer.getInstance());
bt1.render(goog.dom.getElement('buttons'));
goog.events.listen(bt1, goog.ui.Component.EventType.ACTION, 
		function(e){
			this.setSelectable(!this.isSelectable());
			console.log(goog.events.getTotalListenerCount());
		}, false, listitem);

var bt3 = new goog.ui.CustomButton('Change selected',
		goog.ui.Css3ButtonRenderer.getInstance());
bt3.render(goog.dom.getElement('buttons'));
goog.events.listen(bt3, goog.ui.Component.EventType.ACTION, 
		function(e){
			this.setSelected(!this.isSelected());
			console.log(goog.events.getTotalListenerCount());
		}, false, listitem);

var bt4 = new goog.ui.CustomButton('Set description',
		goog.ui.Css3ButtonRenderer.getInstance());
bt4.render(goog.dom.getElement('buttons'));
goog.events.listen(bt4, goog.ui.Component.EventType.ACTION, 
		function(e){
			var newCaption = window.prompt('Enter new description:');
			this.setDescription(newCaption || 'Empty');
			console.log(goog.events.getTotalListenerCount(), this.getDescription());
		}, false, listitem);

var bt5 = new goog.ui.CustomButton('Set tooltip',
		goog.ui.Css3ButtonRenderer.getInstance());
bt5.render(goog.dom.getElement('buttons'));
goog.events.listen(bt5, goog.ui.Component.EventType.ACTION, 
		function(e){
			var newCaption = window.prompt('Enter new tooltip:');
			this.getTooltip().setHtml(newCaption || 'Empty');
			console.log(goog.events.getTotalListenerCount(), this.getTooltip().getHtml());
		}, false, listitem);

var bt2 = new goog.ui.CustomButton('Dispose',
		goog.ui.Css3ButtonRenderer.getInstance());
bt2.render(goog.dom.getElement('buttons'));
goog.events.listen(bt2, goog.ui.Component.EventType.ACTION, 
		function(e){
			this[0].dispose();
			this[1].dispose();
			console.log(goog.events.getTotalListenerCount());
		}, false, [listitem,listitem2]);
</script>
</body>
</html>